<template lang="">
<el-upload class="avatar-uploader"  :action="action"
        :show-file-list="true" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
           <el-icon class="avatar-uploader-icon">
                <Plus/>&emsp;
            点击上传文件
              </el-icon>
        </el-upload>
</template>
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { ElMessage } from "element-plus";
import { Plus } from "@element-plus/icons-vue";
defineProps({
  action: {
    type: String,
  },
});
const imageUrl = ref<String>("");
const handleAvatarSuccess = (response: any, uploadFile: any) => {
  ElMessage.success("上传成功!");
};

const beforeAvatarUpload = (rawFile: any) => {
  //   if (rawFile.type !== "image/jpeg") {
  //     ElMessage.error("Avatar picture must be JPG format!");
  //     return false;
  //   } else if (rawFile.size / 1024 / 1024 > 2) {
  //     ElMessage.error("Avatar picture size can not exceed 2MB!");
  //     return false;
  //   }
  //   return true;
};
</script>
<style scoped>
.avatar-uploader-icon {
  width: 200px;
  height: 200px;
  border: 1px solid #eee;
}
</style>